<template>
    <div>
        <div id="title">
            订单详情
            <el-button type="primary" round id="title-button">返回</el-button>
        </div>
        
        <div id="orderinfo">
            <div class="info-head">
                <span class="headwords">订单信息</span>
            </div>
            <el-descriptions >
                <el-descriptions-item label="订单编号">20200408121324</el-descriptions-item>
                <el-descriptions-item label="订单金额">200</el-descriptions-item>
                <el-descriptions-item label="状态">已收货</el-descriptions-item>
                <el-descriptions-item label="提交时间">2020-03-04  11：08：18</el-descriptions-item>
            </el-descriptions>
            
        </div>

        <div id="medicineinfo">
            <div class="info-head">    
                <span class="headwords">货物信息</span>
            </div>
            
        </div>

        
        <div id="consigneeinfo">
            <div class="info-head">    
                <span class="headwords">收货人信息</span>
            </div>
            <el-descriptions >
                <el-descriptions-item label="收货人">张三</el-descriptions-item>
                <el-descriptions-item label="电话">18812341234</el-descriptions-item>
                <el-descriptions-item label="收货地址">北京市朝阳区石佛营路5号</el-descriptions-item>
            </el-descriptions>
        </div>

        <div id="logisticsinfo">
            <div class="info-head">    
                <span class="headwords">物流信息</span>
            </div>
            <el-descriptions :colon="a">
                <el-descriptions-item label="物流公司">张三</el-descriptions-item>
                <el-descriptions-item label="物流单号">18812341234</el-descriptions-item>  
                <el-descriptions-item >
                    <el-button plain>查看物流</el-button>     
                </el-descriptions-item>  
                 
            </el-descriptions>
            
        </div>

        
    </div>
</template>

<script>
export default {
    created(){
        console.log(this.$route.params)
    },
    data() {
        return {
            
        }
    },
}
</script>

<style>
    #title{
        font-size: 30px;
        font-weight: bolder;
    }
    #title-button{
        margin-left:500px;
    }
    .info-head{
        background-color: #F2F2F2;
        height: 40px;
        font-size: 20px;
        padding-top: 10px;
    }
    .headwords{
        margin-left: 30px;
       
    }
    #orderinfo{
        margin-top: 15px;
        border-color: lightgray;
        border-width: thin;
        border-style: solid;
        width: 1000px;
        height: 180px;
    }
    #medicineinfo{
        margin-top: 15px;
        border-color: lightgray;
        border-width: thin;
        border-style: solid;
        width: 1000px;
        height: 480px;
    }
    #consigneeinfo{
        margin-top: 15px;
        border-color: lightgray;
        border-width: thin;
        border-style: solid;
        width: 1000px;
        height: 180px;
    }
    #logisticsinfo{
        margin-top: 15px;
        border-color: lightgray;
        border-width: thin;
        border-style: solid;
        width: 1000px;
        height: 180px;
    }
  

    
    
</style>